<template>
  <div class="products">
    <BsSubmenu :subMenus="subMenus" />
    <!-- banner -->
    <!-- <section class="banner">
      <div class="text-center f24">
        解决方案
      </div>
    </section> -->
    <div class="hd">
      <img :src="img"  width="100%" alt="">
    </div>

    <BsBuy />
  </div>
</template>

<script>
import BsSubmenu from '@/components/BsSubmenu'
import BsBuy from '@/components/BsBuy'
import img1 from '../assets/images/products/HD1000-1.jpg'
import img2 from '../assets/images/products/HD1500-1.jpg'
import img3 from '../assets/images/products/PT800-1.jpg'

export default {
  components:{BsSubmenu, BsBuy},
  mounted () {
    let type = this.$route.query.type || '1'
    this.img = this.imgs[type]
    // this.subMenus.forEach(v => {
    //   v.active = (type == v.type)
    // })
  },
  // beforeRouteUpdate (to, from, next){
  //   let type = to.query.type || '1'
  //   this.img = this.imgs[type]
  //   this.subMenus.forEach(v => {
  //     v.active = (type == v.type)
  //   })
  //   next()
  // },
  data () {
    return {
      img: '',
      imgs: ['', img1, img2, img3],
      subMenus: [
        // {title: '云会议通用版', link:'/products/page1', active: true},
        {title: '自主软件', link:'/products', active: false, type: 1},
        {title: '智能终端', link:'/products/page4', active: false, type: 1},
        {title: '摄像机', link:'/products/list', active: true, type: 2},
        {title: '周边设备', link:'/products/page5', active: false, type: 3},
      ]
    }
  }
}
</script>

<style scoped>
.banner{
  background: url(../assets/images/products/solutions.jpg) no-repeat center center;
  height: 210px;
  color: #fff;
  line-height: 210px;
}
</style>
